import React from 'react'
import 'normalize.css'

// 路由集成
import { HashRouter } from 'react-router-dom'
import { Layout } from '@/components'

// 引入上下文需要使用的数据
import ThemeCtx, { themes } from '@/utils/theme'
import ThemeContext, { theme } from '@/utils/themeContext'

// mobx 状态管理继承
import store from '@/store'
import { Provider } from 'mobx-react'

// 使用类来创建组件
class App extends React.Component {
	render() {
		return (
			<HashRouter>
				{/* <Provider store={ store }> */}
				
				{/* 下面是为了按需导入 */}
				<Provider { ...store }>
					{/* 使用Provider将要传递的数据进行包裹 */}
					<ThemeContext.Provider value={theme.dark}>
						<ThemeCtx.Provider value={ themes[1] }>
							<Layout />
						</ThemeCtx.Provider>
					</ThemeContext.Provider>
				</Provider>
			</HashRouter>
		)
	}
}

export default App